<template>
  <div class="storeCodeindex">
    <c-title :hide="false" text=""></c-title>
    <template v-if="showBind">
      <div class="storeCode">
        <div class="shopBox">
          <img :src="owner_store.change_thumb" class="shopimg" alt="" />
          <div class="shopName">{{ owner_store.store_name }}</div>
        </div>
        <div class="addressBox">
          <div class="title">
            <i class="iconfont icon-dizhi1"></i>
            <span>门店地址</span>
          </div>
          <div class="address">{{ owner_store.address }}</div>
        </div>
      </div>
      <div class="btnBox set-pc-styleLeft">
        <div class="btn" @click="codeBind">绑定</div>
      </div>
    </template>
    <template v-if="nobind">
      <div class="noneBox">
        <img :src="hostImg" alt="" />
        <span>该收款码暂无绑定商户，无法发起支付！ </span>
      </div>
    </template>
  </div>
</template>
<script>
export default {
  data() {
    return {
      owner_store: null,
      store_id: "",
      hostImg: JSON.parse(localStorage.getItem("yz_basic_info")).host + "/store-code/group.png",
      has_one_store: null,
      showBind: false,
      nobind: false
    };
  },
  activated() {
    this.showBind = false;
    this.nobind = false;
    this.getStoreOid();
  },
  methods: {
    async getStoreOid() {
      let { data, msg, result } = await $http.get("plugin.store-code.api.code.no-auth-info", { code: this.$route.params.code, basic_info: 0 }, ".");
      if (result) {
        let mid = data.store_owner_id;
        if (this.$route.query.mid) {
          // 有带分享id不走店长
          this.getData();
        } else {
          this.getData(mid);
        }
      } else {
        this.$toast(msg);
      }
    },
    async getData(id) {
      let _json = { code: this.$route.params.code };
      if (id) {
        _json.mid = id;
      }
      let { data, msg, result } = await $http.get("plugin.store-code.api.code.info", _json, ".");
      if (result == 1) {
        this.owner_store = data.owner_store;
        this.has_one_store = data.has_one_store;
        this.store_id = data.store_id;
        if (!this.owner_store) {
          // 消费者扫码
          if (this.has_one_store) {
            //收款码已绑定商户，跳转空白页后可跳转收银台页面
            this.$router.push(this.fun.getUrl("cashier_pay", { store_id: data.has_one_store.id }));
          } else {
            // 收款码未绑定商户，跳转空白页后，提示无法支付
            this.nobind = true;
          }
        } else {
          // 商户扫码
          if (this.has_one_store) {
            if (this.has_one_store.id == data.owner_store.id) {
              // 收款码已绑定自己的商户，跳转商户
              this.$router.push(this.fun.getUrl("HomeSeller", { store_id: data.has_one_store.id }));
            } else {
              // 收款绑定的不是自己的商户，去收银台页面
              this.$router.push(this.fun.getUrl("cashier_pay", { store_id: data.has_one_store.id }));
            }
          } else {
            //收款码未绑定商户，跳转空白页后，跳转绑定页面
            this.showBind = true;
          }
        }
      } else {
        this.$toast(msg);
      }
    },
    async codeBind() {
      if (!this.owner_store) return;
      if (this.store_id) {
        this.$toast("收款码已被绑定!");
        return;
      }
      let { data, msg, result } = await $http.post("plugin.store-code.api.code.bind", { code: this.$route.params.code }, ".");
      if (result == 1) {
        this.$router.replace(this.fun.getUrl("home", {}, {}));
      } else {
        this.$toast(msg);
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.btnBox {
  position: fixed;
  bottom: 1.56rem;
  left: 0;
  width: 100%;
  .btn {
    margin: 0 0.75rem;
    padding: 0.78rem 0;
    box-sizing: border-box;
    border-radius: 1.25rem;
    font-weight: 500;
    font-size: 0.94rem;
    color: #ffffff;
    background: #f15353;
  }
}
.noneBox {
  width: 21.94rem;
  height: 15.81rem;
  background: #ffffff;
  margin: 0.63rem 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 0.81rem;
  color: #6e6e79;
  img {
    margin: 0;
    width: 7.19rem;
    height: 7.19rem;
    margin-bottom: 0.47rem;
  }
}
.storeCode {
  margin: 0.63rem 0.75rem;
  padding: 2.19rem 0.63rem 0.63rem 0.63rem;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: 0.5rem;

  .addressBox {
    background: #f5f5f5;
    border-radius: 0.5rem;
    padding: 0.63rem 1.06rem;
    box-sizing: border-box;
    text-align: left;
    .title {
      display: flex;
      align-items: center;
      font-weight: bold;
      font-size: 0.94rem;
      color: #00001c;
      text-align: left;
      margin-bottom: 0.32rem;
      .icon-dizhi1 {
        margin-right: 0.32rem;
      }
    }
    .address {
      font-size: 0.88rem;
      color: #00001c;
    }
  }
  .shopBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 1.5rem;
    .shopimg {
      width: 5rem;
      height: 5rem;
      border-radius: 50%;
      margin-bottom: 0.8rem;
    }
    .shopName {
      font-weight: 500;
      font-size: 1.13rem;
    }
  }
}
</style>
